﻿<UserControl 
  x:Class="ContentControl3D_Demo.Samples.RotationDirectionSample"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:thriple="http://thriple.codeplex.com/"
  Background="WhiteSmoke"
  >
  <UserControl.Resources>
    <DataTemplate x:Key="ListItemTemplate">
      <Border Background="#88000000" BorderBrush="Gray" BorderThickness="2" CornerRadius="6">
        <DockPanel Width="150" Height="150">
          <Button 
            DockPanel.Dock="Bottom" 
            Command="thriple:ContentControl3D.RotateCommand" 
            Content="Flip" 
            />
          <TextBlock 
            x:Name="sideLabel" 
            DockPanel.Dock="Top"
            Foreground="LightCyan"
            Margin="4,2,0,0"
            Text="Front Side"  
            />
          <TextBlock 
            Background="#BB000000"
            FontSize="13" 
            FontWeight="Bold" 
            Foreground="WhiteSmoke"
            HorizontalAlignment="Center"
            Padding="4"
            Text="{Binding}" 
            TextAlignment="Center" 
            VerticalAlignment="Center" 
            />
        </DockPanel>
      </Border>
      <DataTemplate.Triggers>
        <Trigger Property="thriple:ContentControl3D.IsOnFrontSide" Value="False">
          <Setter TargetName="sideLabel" Property="Text" Value="Back Side" />
          <Setter TargetName="sideLabel" Property="Foreground" Value="Yellow" />
        </Trigger>
      </DataTemplate.Triggers>
    </DataTemplate>
  </UserControl.Resources>

  <ListBox 
    HorizontalAlignment="Center"
    ItemsSource="{Binding}" 
    PreviewKeyDown="ListBox_PreviewKeyDown"
    ScrollViewer.HorizontalScrollBarVisibility="Disabled"
    >
    <ListBox.ItemContainerStyle>
      <Style TargetType="{x:Type ListBoxItem}">
        <Setter Property="Template">
          <Setter.Value>
            <ControlTemplate TargetType="{x:Type ListBoxItem}">
              <thriple:ContentControl3D 
                BackContent="{Binding}"
                BackContentTemplate="{StaticResource ListItemTemplate}"
                Content="{Binding}"
                ContentTemplate="{StaticResource ListItemTemplate}"
                RotationDirection="{Binding}" 
                Width="300" Height="300"
                />
            </ControlTemplate>
          </Setter.Value>
        </Setter>
      </Style>
    </ListBox.ItemContainerStyle>

    <ListBox.ItemsPanel>
      <ItemsPanelTemplate>
        <WrapPanel />
      </ItemsPanelTemplate>
    </ListBox.ItemsPanel>

    <ListBox.Background>
      <ImageBrush ImageSource="Images/Compass.png" Opacity="0.25" />
    </ListBox.Background>
  </ListBox>
</UserControl>